<template>
	<view>
		<view class="header center">
			<image src="../../static/index/个人中心@2x.png" mode="widthFix" class="avatar posf"
				@click="open('../user/user')">
			</image>
			<div class="fbold">智能体</div>
			<!-- <image :src="logoUrl" mode="widthFix" class="logo"></image> -->
		</view>

		<scroll-view class="main">
			<view class="box" v-for="item in botArray" @click="open('../detail/detail?botId='+item.botId)">
				<view class="icon-box">
					<image mode="widthFix" class="logo-icon" :src="item.iconUrl"></image>
				</view>
				<view class="box-content flex1">
					<view class="box-content-name">{{item.name}}</view>
					<view class="box-content-desc">{{item.description}}</view>
				</view>
				<!-- <view class="btn-box f22 ctheme center">
					使用
				</view> -->
			</view>
			<!-- <div class="box bfff">
				<div class="mb20 flex-start">
					<image src="../../static/index/我的-常见问题@2x.png" mode="widthFix" class="tiwen-icon mr12"></image>
					<div class="f32 fbold c333">我猜你需要：</div>
				</div>
				<div class="questions-box space-between" v-for="item in suggestArray"
					@click="open('../detail/detail?text='+item.title)">
					<div class="f30 c333 flex1 nowrap">{{item.title}}</div>
					<image src="../../static/index/箭头@2x.png" mode="widthFix" class="arrow-right"></image>
				</div>
			</div> -->
		</scroll-view>
		<!-- 底部输入框 -->
		<!-- <bottomSend @send='send'></bottomSend> -->
		<!-- 底部弹出层 -->
		<div>
			<up-popup :show="show" mode="bottom" :closeOnClickOverlay="false" :round="25">
				<view class="tanchaung-box bfff colum">
					<image src="../../static/组2@2x.png" mode="widthFix" class="t-logo"></image>
					<div class="f36 fbold c333 mb25">小欧AI</div>
					<div class="f28 c999 mb45">你的超级智能助手</div>
					<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" v-if="agreeement"
						class="cfff center f36 fbold mb35 phone">手机号授权</button>
					<button v-else class="cfff center f36 fbold mb35  phoneDisabled">手机号授权</button>
					<div class="f28 c333 mb40" @click="close">取消使用</div>
					<div class="flex-start">
						<image @click="agreeement=false" v-if="agreeement" src="../../static/index/check2.png"
							mode="widthFix" class="check-icon mr10"></image>
						<image @click="agreeement=true" v-else src="../../static/index/check1.png" mode="widthFix"
							class="check-icon mr10"></image>

						<div class="f24 tips">我已阅读并同意 <span class="cee7">《隐私协议》</span>和 <span
								class="cee7">《用户使用协议》</span></div>
					</div>
				</view>
			</up-popup>
		</div>
	</view>
</template>

<script setup>
	// import bottomSend from '@/components/bottomSend/bottomSend'
	import {
		login,
		getopenid,
		AIRegister
	} from '../../apis/login';
	import {
		suggestList
	} from '../../apis/suggest';

	import {
		getLogo
	} from '../../apis/boot.js'
	import {
		botList
	} from '../../apis/botinfo.js'
	import {
		getCurrentInstance,
		ref
	} from 'vue'
	import {
		onLoad,
		onShow
	} from "@dcloudio/uni-app";
	import useLoginStore from '@/store/modules/index'
	import {
		storeToRefs
	} from 'pinia'

	const loginStore = useLoginStore()
	const {
		proxy
	} = getCurrentInstance()


	// // 发送事件
	// function send(text, imgUrl) {
	// 	proxy.open(`../detail/detail?text=${text}&imgUrl=${imgUrl}`)
	// }
	// 弹窗
	const show = ref(false)
	const agreeement = ref(false)
	// const logoUrl = ref('')
	const botArray = ref([])

	async function getPhoneNumber(res) {
		if (!res.detail.iv) {
			uni.showToast({
				title: '您拒绝了授权！',
				icon: 'none'
			})
			return;
		}
		uni.showLoading();



		const result = await AIRegister({
			appid: 'wx511728e8c5850f0b',
			openid: uni.getStorageSync('openid'),
			encryptedData: res.detail.encryptedData,
			iv: res.detail.iv
		})
		uni.hideLoading();
		show.value = false
		defaultLogin()
	}

	function close() {
		wx.exitMiniProgram({
			success: (res) => {}
		})
	}

	const {
		uinfo
	} = storeToRefs(loginStore)

	//默认执行登录
	async function defaultLogin() {
		let openId = uni.getStorageSync('openid')
		if (!openId) {
			let code = (await uni.login()).code;
			openId = (await getopenid({
				appid: 'wx511728e8c5850f0b',
				code: code
			})).openid;
			uni.setStorageSync('openid', openId)
		}
		let result = (await login({
			appid: 'wx511728e8c5850f0b',
			openid: openId
		}));

		if (result.errcode) {
			show.value = true
		} else {
			uni.setStorageSync('userinfo', result)
			getBotList()
		}

	}
	const suggestArray = ref([])
	async function initSuggestList() {

		let result = (await suggestList({}));
		if (!result.errcode) {
			suggestArray.value = result
		}
	}

	// async function getLogoUrl() {
	// 	const result = await getLogo()
	// 	logoUrl.value = result.data
	// 	uni.setStorageSync('logoUrl', logoUrl.value)
	// }

	async function getBotList() {
		const result = await botList()
		botArray.value = result.success ? result.data : []
	}

	onLoad((option) => {
		// getLogoUrl()
	});
	onShow(() => {
		// initSuggestList()
		defaultLogin()
	});
</script>
<style lang='scss' scoped>
	/* 弹窗 */
	.tanchaung-box {
		/* height: 615rpx; */
		width: 750rpx;
		border-radius: 25rpx 25rpx 0rpx 0rpx;
		padding: 30rpx 60rpx 58rpx;

		.t-logo {
			width: 164rpx;
			height: 164rpx;
		}

		.phone {
			width: 492rpx;
			height: 90rpx;
			background: linear-gradient(to right, #FE9B46, #F16124);
			border-radius: 54rpx;
		}

		.phoneDisabled {
			width: 492rpx;
			height: 90rpx;
			color: #9A9A9A !important;
			border-radius: 54rpx;
		}

		.check-icon {
			width: 46rpx !important;
			height: 46rpx !important;
		}

		.tips {
			color: #9A9A9A;
		}

		.cee7 {
			color: #EE7C4B;
		}

	}

	.header {
		width: 100vw;
		height: 160rpx;
		margin: 57rpx 0 -20rpx 0;
	}

	.main {
		/* margin: 220rpx 0 20rpx 0; */
		padding: 0rpx 20rpx 80rpx;
		position: relative;
		height: calc(100vh - 100rpx);

		.box {
			padding: 20rpx 20rpx 30rpx;
			margin-bottom: 10rpx;
			display: flex;
			align-items: flex-start;
			position: relative;
			/* &::after{
				content: ' ';
				position: absolute;
				right: 20rpx;
				bottom: 0;
				height: 1px;
				width: 530rpx;
				background-color: #efefef;
			} */

			.btn-box {
				border: 1rpx solid #FB5353;
				border-radius: 15rpx;
				width: 80rpx;
				height: 45rpx;
			}

			.icon-box {
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.logo-icon {
				width: 114rpx;
				height: 114rpx;
				border-radius: 50% 50% 50% 50%;
			}

			.box-content {
				padding: 0 30rpx;
				/* width: 520rpx; */

				.box-content-name {
					padding-bottom: 10rpx;
					font-weight: 600;
				}

				.box-content-desc {
					font-size: 28rpx;
					color: #000;
					overflow: hidden;
					text-overflow: ellipsis;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
					display: -webkit-box;
				}
			}

			.arrow-icon {
				width: 24rpx;
				height: 24rpx;
			}


			.tiwen-icon {
				width: 38rpx;
				height: 38rpx;
			}

			.questions-box {
				/* width: 670rpx; */
				/* height: 100rpx; */
				padding: 24rpx 0 30rpx;
				border-bottom: 1rpx solid #EFEFF4;

				.arrow-right {
					width: 20rpx;
					height: 30rpx;
				}
			}

			.questions-box:last-child {
				border-bottom: none;
			}
		}
	}

	.logo {
		width: 170rpx;
		height: 220rpx;
		display: block;
		margin: 220rpx auto 75rpx;
	}

	.avatar {
		width: 60rpx;
		height: 60rpx;
		left: 30rpx;
		top: 100rpx;
	}
</style>